<template>
	<div style="padding-bottom: 100px;">
		<view style="background-color: #ffffff;margin: 10px;border-radius: 12px;padding: 15px;">
			<uni-forms ref="form" :value="formData" :rules="rules" labelWidth="75px">
				<uni-forms-item label="公司名称" name="deptName" required>
					<uni-easyinput type="text" v-model="formData.deptName" placeholder="请输入公司名称" />
				</uni-forms-item>
				<uni-forms-item label="公司性质" name="deptNature" required>
					<uni-data-select v-model="formData.deptNature" :localdata="deptNature"
						style="background-color: white;" />
				</uni-forms-item>
				<uni-forms-item label="成立时间" name="deptDate" required>
					<uni-datetime-picker type="date" v-model="formData.deptDate" />
				</uni-forms-item>
				<uni-forms-item label="人员规模" name="staffNum" required>
					<uni-easyinput type="number" v-model="formData.staffNum" placeholder="请输入人员规模(人)" />
				</uni-forms-item>
				<uni-forms-item label="业务范围" name="deptBizScope" required>
					<uni-easyinput type="text" v-model="formData.deptBizScope" placeholder="请输入业务范围" />
				</uni-forms-item>
				<uni-forms-item label="拥有车辆" name="vehicleNum" required>
					<uni-easyinput type="number" v-model="formData.vehicleNum" placeholder="请输入拥有车辆(台)" />
				</uni-forms-item>
				<uni-forms-item label="办公电话" name="deptTel" required>
					<uni-easyinput type="text" v-model="formData.deptTel" placeholder="请输入办公电话" />
				</uni-forms-item>
				<uni-forms-item label="邮政编码" name="deptCode">
					<uni-easyinput type="text" v-model="formData.deptCode" placeholder="请输入邮政编码" />
				</uni-forms-item>
				<uni-forms-item label="经营地址" name="deptDistrict" required>
					<uni-data-picker placeholder="请选择地址" popup-title="请选择所在地区" :localdata="deptDistrict" style="background-color: white;"
						v-model="formData.deptDistrict">
					</uni-data-picker>
					<view style="margin-top: 20px;">
						<uni-easyinput type="text" v-model="formData.deptAddress" placeholder="请输入详细地址" />
					</view>
				</uni-forms-item>
				<uni-forms-item label="联系人" name="leader" required>
					<uni-easyinput type="text" v-model="formData.leader" placeholder="请输入联系人" />
				</uni-forms-item>
				<uni-forms-item label="职务" name="deptPost" required>
					<uni-easyinput type="text" v-model="formData.deptPost" placeholder="请输入职务" />
				</uni-forms-item>
				<uni-forms-item label="联系电话" name="phone" required>
					<uni-easyinput type="text" v-model="formData.phone" placeholder="请输入联系电话" />
				</uni-forms-item>
				<uni-forms-item label="电子邮箱" name="email" required>
					<uni-easyinput type="text" v-model="formData.email" placeholder="请输入电子邮箱" />
				</uni-forms-item>
				<myfilepicker :limit="'1'" :imageStyles="imageStyles" :fileIdString="formData.deptLicenseUrl" :fileExtname="'png,jpg,jpeg'" :fileMediatype="'image'"  @transFileIdString="getFileIdString_deptLicenseUrl"
						:title="'*点击上传营业执照，支持png/jpg/jpeg，最多可上传1个附件*'"><uni-icons type="cloud-upload" size="18"></uni-icons>营业执照</myfilepicker>
				<view style="margin-top: 10px;">
					<myfilepicker :limit="'1'" :imageStyles="imageStyles" :fileIdString="formData.deptOpenPremit" :fileExtname="'png,jpg,jpeg'" :fileMediatype="'image'"  @transFileIdString="getFileIdString_deptOpenPremit"
							:title="'*点击上传开户许可证，支持png/jpg/jpeg，最多可上传1个附件*'"><uni-icons type="cloud-upload" size="18"></uni-icons>开户许可证</myfilepicker>
				</view>
				<view style="margin-top: 10px;">
					<myfilepicker :limit="'1'" :imageStyles="imageStyles" :fileIdString="formData.legalIdcardUrl" :fileExtname="'png,jpg,jpeg'" :fileMediatype="'image'"  @transFileIdString="getFileIdString_legalIdcardUrl"
							:title="'*点击上传法人身份证(正面)，支持png/jpg/jpeg，最多可上传1个附件*'"><uni-icons type="cloud-upload" size="18"></uni-icons>法人身份证(正面)</myfilepicker>
				</view>
				<view style="margin-top: 10px;">
					<myfilepicker :limit="'1'" :imageStyles="imageStyles" :fileIdString="formData.legalIdcardUrl2" :fileExtname="'png,jpg,jpeg'" :fileMediatype="'image'"  @transFileIdString="getFileIdString_legalIdcardUrl2"
							:title="'*点击上传法人身份证(反面)，支持png/jpg/jpeg，最多可上传1个附件*'"><uni-icons type="cloud-upload" size="18"></uni-icons>法人身份证(反面)</myfilepicker>
				</view>
				<view style="margin-top: 10px;">
					<myfilepicker :limit="'3'" :imageStyles="imageStyles" :fileIdString="formData.deptPlateUrl" :fileExtname="'png,jpg,jpeg'" :fileMediatype="'image'"  @transFileIdString="getFileIdString_deptPlateUrl"
							:title="'*点击上传场所照片，支持png/jpg/jpeg，最多可上传3个附件*'"><uni-icons type="cloud-upload" size="18"></uni-icons>场所照片(限3张)</myfilepicker>
				</view>
				<view style="margin-top: 10px;">
					<myfilepicker :limit="'3'"  :fileIdString="formData.otherInfo" :fileExtname="'pdf,png,gif,jpg,jpeg,doc,docx'" :fileMediatype="'all'"  @transFileIdString="getFileIdString_otherInfo"
							:title="'*点击上传其他附件，支持pdf/doc/docx/jpg/jpeg/png/gif，最多可上传3个附件*'"></myfilepicker>
				</view>
			</uni-forms>
		</view>
		<view
			style="background-color: #ffffff;z-index: 2;height: 70px;width:100%;position: fixed;bottom: 0;display: flex;box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.1);">
			<view
				style="display: flex;align-items: center;width: 100%;height: 60px;justify-content: center;">
				<view  @click="submit()" hover-class="buttonHover"
					style="height: 35px;background-color: #bf5f09;color: #ffffff;width: 100px;display: flex;justify-content: center;align-items: center;border-radius: 4px;">
					提交</view>
			</view>
		</view>
	</div>
</template>

<script>
	import {getDicts,getAllAddressTree} from '@/api/system/dict.js'
	import {deptextAdd} from '@/api/login.js'
	import {getFileList,uploadFile} from '@/api/system/uploadFile.js'
	import myfilepicker from '@/components/uploadFile/uploadFile.vue'
	import {getByDeptIdDetail} from '@/api/login.js'
	export default {
		components: {
			myfilepicker
		},
		data() {
			return {
				formData: {
					deptName: "",
					deptNature: "",
					deptDate: "",
					staffNum: "",
					deptBizScope: "",
					vehicleNum: "",
					deptCode:"",
					deptTel: "",
					deptDistrict: "",
					deptAddress:"",
					leader:"",
					deptPost:"",
					phone:"",
					email:"",
					
					deptLicenseUrl:"",
					deptOpenPremit:"",
					deptRoadLicense:"",
					deptPlateUrl:"",
					legalIdcardUrl:"",
					legalIdcardUrl2:"",
					otherInfo:"",
				},
				// 校验规则
				rules: {
					deptName: {
						rules: [{
							required: true,
							errorMessage: '请输入公司名称',
						}]
					},
					deptNature: {
						rules: [{
							required: true,
							errorMessage: '请选择公司性质',
						}]
					},
					deptDate: {
						rules: [{
							required: true,
							errorMessage: '请选择公司成立时间',
						}]
					},
					staffNum: {
						rules: [{
							required: true,
							errorMessage: '请输入人员规模',
						}]
					},
					deptBizScope: {
						rules: [{
							required: true,
							errorMessage: '请输入业务范围',
						}]
					},
					vehicleNum: {
						rules: [{
							required: true,
							errorMessage: '请输入拥有车辆',
						}]
					},
					deptTel: {
						rules: [{
							required: true,
							errorMessage: '请输入办公电话',
						}]
					},
					deptDistrict: {
						rules: [{
							required: true,
							errorMessage: '请选择地址',
						}]
					},
					leader: {
						rules: [{
							required: true,
							errorMessage: '请输入联系人',
						}]
					},
					deptPost: {
						rules: [{
							required: true,
							errorMessage: '请输入职务',
						}]
					},
					phone: {
						rules: [{
							required: true,
							errorMessage: '请输入联系电话',
						}]
					}
				},
				//地址下拉
				deptDistrict: [],
				//公司性质
				deptNature:[],
				imageStyles: {
					width: 300,
					height: 200,
					border: {
						radius: '4px'
					}
				},
				deptId:'',
			}
		},
		onLoad(e) {
		    uni.getSystemInfo({
		        success: res => {
		            this.imageStyles.width = res.windowWidth;
		        }
		    });
			if(e.deptId)
			{
				uni.showLoading({
					title: '正在加载',
				})
				this.deptId=e.deptId
				//获取部门详情
				getByDeptIdDetail(e.deptId).then(res => {
					uni.hideLoading()
					if (res.code == '200') {
						if(res.data.deptName) //如果当前已提交认证
						{
							uni.navigateTo({
								url: '/pages/login/underAudit'
							})
						}
						this.formData=res.data	
					} else {
						uni.showToast({
							icon: 'none',
							title: res.msg
						})
					}	
				})
			}
			
		},
		created() {
			//获取公司性质下拉框
			getDicts('customer_nature').then(res=>{
				this.deptNature=res.data.map(item=>{
					return {
						value:item.dictValue,
						text:item.dictLabel
					}
				})
			})
			
			//获取全国地址信息->地区下拉框
			getAllAddressTree().then(res=>{
				this.deptDistrict=res.data
			})
		},
		methods: {
			//接收文件传递的id字符串集合
			getFileIdString_deptLicenseUrl(fileIds){
				this.formData.deptLicenseUrl=fileIds
			},
			//接收文件传递的id字符串集合
			getFileIdString_deptOpenPremit(fileIds){
				this.formData.deptOpenPremit=fileIds
			},
			//接收文件传递的id字符串集合
			getFileIdString_legalIdcardUrl(fileIds){
				this.formData.legalIdcardUrl=fileIds
			},
			//接收文件传递的id字符串集合
			getFileIdString_legalIdcardUrl2(fileIds){
				this.formData.legalIdcardUrl2=fileIds
			},
			//接收文件传递的id字符串集合
			getFileIdString_deptPlateUrl(fileIds){
				this.formData.deptPlateUrl=fileIds
			},
			//接收文件传递的id字符串集合
			getFileIdString_otherInfo(fileIds){
				this.formData.otherInfo=fileIds
			},
			submit(form) {
				this.$refs.form.validate().then(res => {
					uni.showLoading({
						title: '正在提交...',
					})
					deptextAdd({
							deptType:'1',
							deptId: this.deptId,
							...this.formData,
						}).then(res => {
							uni.hideLoading()
						if (res.code == '200') {
							uni.showToast({
								title: '提交成功',
								icon: 'none'
							})
							//正在审核页
							uni.navigateTo({
								url:'/pages/login/underAudit'
							})
							
						} else {
							uni.showToast({
								icon: 'none',
								title: res.msg
							})
						}
					})
							
				}).catch(err => {
					uni.showToast({
						title: err[0].errorMessage,
						icon: 'none'
					})
				})
			}
		},
	}
</script>

<style scoped>
.buttonHover{
	opacity: 0.6;
	transform: translate(1px,1px);
}
</style>